今回は、プルダウンメニューを利用してリンク集を作成する方法を解説します。たぶん、みなさんもどこかのホームページで似たようなテクニックに遭遇しているのではないでしょうか？　そんなに難しくはないので試してみてください。

まずは、FORMを利用してプルダウンメニューを作成します。この際に注意すべき点は、最初の項目に「▼リンク先を選択」などと表示し、リンク機能として使わないことです。というのも、この項目は初めから選択されている項目になるため、リンク用のJavaScriptを作動できないからです。また、FORMタグとSELECTタグに名前（name属性）を付けておきます。今回は、FORMタグに"form1"、SELECTタグに"link"という名前を付けました。 <FORM name="form1"> <SELECT name="link"> <OPTION>▼リンク先を選択</OPTION> <OPTION>Infoseek トップページ</OPTION> <OPTION>Infoseek ニュース</OPTION> <OPTION>Infoseek 天気</OPTION> <OPTION>Infoseek TV番組表</OPTION> <OPTION>Infoseek スポーツ</OPTION> <OPTION>Infoseek マルチ辞書</OPTION> </SELECT> </FORM>

続いて、SELECTタグにonChangeイベントを追加し、選択項目を変更した際に「OpenLink()」というJavaScript関数が実行されるようにします。また、各OPTIONタグ（1番目を除く）にvalue属性を追加し、その値にリンク先のURLを指定します。 <FORM name="form1"> <SELECT name="link" onChange="OpenLink()"> <OPTION>▼リンク先を選択</OPTION> <OPTION value="http://www.infoseek.co.jp/">Infoseek トップページ</OPTION> <OPTION value="http://news.www.infoseek.co.jp/">Infoseek ニュース</OPTION> <OPTION value="http://tenki.www.infoseek.co.jp/">Infoseek 天気</OPTION> <OPTION value="http://tv.www.infoseek.co.jp/">Infoseek TV番組表</OPTION> <OPTION value="http://sports.infoseek.co.jp/">Infoseek スポーツ</OPTION> <OPTION value="http://dictionary.www.infoseek.co.jp/">Infoseek マルチ辞書 </OPTION> </SELECT> </FORM>

あとは「OpenLink()」のJavaScript関数を自作するだけでテクニックが完成します。この関数では、プルダウンメニューの何番目が選択されているか（selectedIndex）を変数「n」に代入します。selectedIndexは0から数えていくため、n=0の場合は「▼リンク先を選択」の項目が選択されていることになります。よって、「n=0でない場合」を条件に処理を分岐し、location.hrefを選択項目のvalue属性の値に変更します。これでlocation.hrefがリンク先のURLに置き換わる、すなわちリンク先へ移動することができます。 <SCRIPT language="JavaScript"> <!-- function OpenLink(){ var n = document.form1.link.selectedIndex; if (n != 0){ location.href = document.form1.link.options[n].value; } } //--> </SCRIPT>

�y�V���o�C��[UNLIMIT��������1�~] EC�i�r���|�C���� Yahoo �y�V LINE���f�[�^�����[�������z500�~�`�I

�����z�[���y�[�W �������N���W�b�g�J�[�h �C�O�i���q���� �����������O�~�y�������������z �C�O���s�����������I �C�O�z�e��